<template>
	<u-popup :show="is_show" @close="is_show = false" round="10" mode="bottom" :safeAreaInsetBottom="true"
		closeOnClickOverlay :closeable="true">
		<view class="share">
			<!-- #ifdef MP-WEIXIN -->
			<view class="share-content u-flex">
				<view class="li">
					<button class="share-btn u-flex-column u-flex-center" :data-params="shareParams" :plain="true"
						open-type="share">
						<u-image :src="$getImageUrl('/user_client/static/icons/weixin.png')" width="70rpx"
							:showMenuByLongpress="false" height="80rpx" mode="widthFix"></u-image>
						<view class="li-text">微信好友</view>
					</button>
				</view>
				<view class="li u-flex-column u-flex-center" @click="linkClick">
					<u-image :src="$getImageUrl('/user_client/static/icons/lianjies.svg')" width="70rpx"
						:showMenuByLongpress="false" height="80rpx" mode="widthFix"></u-image>
					<view class="li-text">复制链接</view>
				</view>
				<view class="li" @click="posterClick" v-if="isPoster">
					<view class="li-content u-flex-column u-flex-center">
						<u-image :src="$getImageUrl('/user_client/static/icons/poster.png')" width="70rpx"
							:showMenuByLongpress="false" height="80rpx" mode="widthFix"></u-image>
						<view class="li-text">生成海报</view>
					</view>
				</view>
			</view>
			<!-- #endif -->
			<!-- #ifdef H5||APP-PLUS -->
			<view class="share-content u-flex">
				<view class="li" @click="shareClick">
					<button class="share-btn u-flex-column u-flex-center" :data-params="params" :plain="true"
						open-type="share">
						<u-image src="/static/icons/weixin.png" width="70rpx" :showMenuByLongpress="false"
							height="80rpx" mode="widthFix"></u-image>
						<view class="li-text">微信好友</view>
					</button>
				</view>
			</view>
			<!-- #endif -->
		</view>
	</u-popup>
</template>

<script>
	export default {
		data() {
			return {
				is_show: false,
				shareParams: {
					title: '', // 分享标题
					imageUrl: '' //图片路径
				},
				linkUrl: ''
			}
		},
		props: {
			isPoster: {
				type: Boolean,
				default: true
			}
		},
		methods: {
			show(e = {}) {
				// console.log(e,'e')
				// const {
				// 	cover_image,
				// 	name
				// } = e
				this.params = e
				this.is_show = true;
			},
			posterClick() {
				const params = JSON.stringify(this.params); // 转换参数为 JSON 字符串
				const encodedParams = encodeURIComponent(params); // URL 编码参数
				this.$navigateTo(`/subPackages/product/product-poster?params=${encodedParams}`);
			},
			// 获取分享链接
			linkClick() {
				this.$get("product/getWebUrl", {
					product_id: this.params.id
				}).then(res => {
					this.linkUrl = res.data
					this.$copyText(this.linkUrl)
				}).catch(ex => {
					console.log(ex)
					this.$errorToast(ex);
				})
			},
			shareClick() {
				// #ifdef MP-WEIXIN
				/** 分享到微信 */
				// uni.share({
				// 	title: '分享标题',
				// 	imageUrl: 'https://qn.mtj.cdydsy.com/logo/android/1024.png',
				// 	path: '/pages/index/index', // 分享的页面路径
				// 	// imageUrl: "https://qn.mtj.cdydsy.com/logo/android/1024.png", //分享封面图片
				// 	// miniProgram: {
				// 	// 	path: 'pages/index/index',
				// 	// 	type: 1
				// 	// },
				// 	success: function(res) {
				// 		this.show = false
				// 		// 此处是调起微信分享成功的回调
				// 		console.log('成功')
				// 	},
				// 	fail: function(err) {
				// 		console.log(err)
				// 		console.log('失败')
				// 		// 此处是调起微信分享失败的回调
				// 	}
				// });
				//  #endif 
				// #ifdef H5||APP-PLUS 
				var weixinShare = null;
				plus.share.getServices(function(services) {
					for (var i in services) {
						var service = services[i];
						// 获取微信分享对象 
						if (service.id == 'weixin') {
							weixinShare = service;
							break;
						}
					}
					weixinShare.send({
						content: '欢迎使用美条街，复制此链接https://gw.mtj.cdydsy.com/打开app'
					}, function() {
						this.show = false
						// 分享成功 
					}, function(err) {
						// 分享操作失败  
						// err.code是错误码
					})
				}, function(err) {
					// 获取 services 失败
				})
				//  #endif
			}
		},
	}
</script>

<style lang="scss" scoped>
	.share {
		padding: 60rpx 0 200rpx 0;

		.li {
			width: 20%;

			.share-btn {
				width: 100%;
				border: 0;
				background-color: #FFFFFF;
				padding: 0;
				margin: 0;
			}

			.li-text {
				line-height: 1;
				font-size: 26rpx;
				padding-top: 10rpx;
			}
		}
	}
</style>